严格模式

React.StrictMode，本质上是一个组件，该组件不进行 UI 渲染

• 识别不安全的生命周期
• 关于使用过时字符串 ref API 的警告
• 关于使用废弃的 findDOMNode 方法警告
• 检测意外的副作用（一个函数中，做了一些会影响函数外部数据的事情）
  • 异步处理
  • 改变参数值
  • setState
  • 本地存储
  • 改变函数外部的变量
• 检测过时的 context API

不会产生副作用的 React 生命周期函数

1. componentDidMount
2. componentDidUpdate
3. componentWillUnmount

import React, {Component} from 'react';
import ReactDOM from 'react-dom';

class Comp extends Component {
    constructor (props) {
        super(props);
        setTimeout(() => {  // 严格模式下副作用代码会调用两遍（仅在开发模式下有效）
            console.log(111111);
        }, 0);
    }
    render () {
        return (<h1>hello</h1>);
    }
}

// React.StrictMode 开启严格模式
ReactDOM.render(<React.StrictMode>
    <Comp />
</React.StrictMode>, document.getElementById('root'));